<template>
	<div class="breadcrumb" >
		<ul >
			<li><a href="#/main/index">首頁</a></li>
			<li><a href="#/uc">用戶中心</a></li>
			<slot name="node"></slot>
			<li><slot></slot></li>
		</ul>
	</div>
</template>

<script>
export default {
    props: {
        items: {
            type: Array,
            default: () => {}
		},
		width:{ type:Number,default:500 }
    },
    name: "breadcrumb",
    data () {
        return {

        }
    }
}
</script>

<style lang="less" scoped>
	/*面包屑*/
	.breadcrumb {margin: 10px}
	.breadcrumb ul {padding: 0px 0px;display: flex;}
	.breadcrumb ul li {color:#535353;}
	.breadcrumb ul li a{font-size:14px;color:#535353;}
	.breadcrumb ul li a:hover{color:#f50;}
	.breadcrumb ul li.active,.breadcrumb ul li:last-child{color:#a9b0b6 !important;}
	.breadcrumb ul li:after{content: " /";width:20px;color:#a9b0b6 !important;display: inline-block;text-align: center;}
	.breadcrumb ul li:last-child:after{content: '';}
</style>
